<template>
  <div>
    <div class="relative">
      <div class="absolute" style="top: -120px; right: 20px;">
        <button class="button-block" @click="get_panoramicURL">发布</button>
      </div>
    </div>

    <div class="tableClass mt20" style="margin: 20px 20px 0 20px;">
      <table>
        <tr>
          <th style="height: 50px">360全景URL</th>
          <td>
            <input type="text" class="input-l" style="width: 400px;" v-model="panoramicURL.VIEW_URL" placeholder="请输入360全景URL">
          </td>
        </tr>
        <tr>
          <th style="height: 50px">
            第三方URL1</th>
          <td>
            <input type="text" class="input-l" style="width: 400px;" v-model="panoramicURL.OTHER_URL_1" placeholder="请输入第三方URL1">
          </td>
        </tr>
        <tr>
          <th style="height: 50px">
            第三方URL2</th>
          <td>
            <input type="text" class="input-l" style="width: 400px;" v-model="panoramicURL.OTHER_URL_2" placeholder="请输入第三方URL2">
          </td>
        </tr>
        <tr>
          <th style="height: 50px">
            第三方URL3</th>
          <td>
            <input type="text" class="input-l" style="width: 400px;" v-model="panoramicURL.OTHER_URL_3" placeholder="请输入第三方URL3">
          </td>
        </tr>
        <tr>
          <th style="height: 50px">
            第三方URL4</th>
          <td>
            <input type="text" class="input-l" style="width: 400px;" v-model="panoramicURL.OTHER_URL_4" placeholder="请输入第三方URL4">
          </td>
        </tr>
        <tr v-for="item in fileList">
          <th style="height: 50px">{{item.name}}</th>
          <td>
            <button class="button-line" @click="fileUpload_show(item)">文件上传</button>
          </td>
        </tr>
      </table>
    </div>
    <edit_Upload :visible="visible" @close="visible = false" :fileData="edit_uploadData"
                 ref="edit_Upload"></edit_Upload>
  </div>
</template>

<script>
  export default {
    name: 'dataUpload',
    data() {
      return {
        visible: false,
        fileList: '',
        edit_uploadData: {},
        panoramicURL: '',
        panoramicID: ''
      }
    },
    components: {
      edit_Upload(resolve) {
        require(['./edit_Upload.vue'], resolve)
      }
    },
    created() {
      this.get_childSystemList()
    },
    methods: {
      release() {
      },
      fileUpload_show(data) {
        this.visible = true
        this.edit_uploadData = data
        this.$refs.edit_Upload.get_uploadDataInfo(data.param4, data.value)
        console.log(data);
      },
      // 获取资料上传子系统列表
      get_childSystemList() {
        this.$axios({
          method: 'get',
          url: `${this.$site.videoServer}/project/project_param_upload.do`
        }).then(res => {
          console.log(res);
          if (res.data.status == 200) {
            this.fileList = res.data.data.standardCodeList
            this.panoramicID = res.data.data.group.id
            this.panoramicURL = {
             "VIEW_URL": res.data.data.groupParams[0].groupParamValue,
             "OTHER_URL_1": res.data.data.groupParams[3].groupParamValue,
             "OTHER_URL_2": res.data.data.groupParams[4].groupParamValue,
             "OTHER_URL_3": res.data.data.groupParams[5].groupParamValue,
             "OTHER_URL_4": res.data.data.groupParams[6].groupParamValue
            }
          }

        })
      },
      // 获取360全景url
      get_panoramicURL() {

        if (this.panoramicURL == '') {
          this.$message.error('360全景URL为空')
          return
        }

        let data = {
          id: this.panoramicID,
          "groupParamValue_GROUP_PARAMS.360VIEW_URL": this.panoramicURL.VIEW_URL,
          "groupParamValue_GROUP_PARAMS.SAFETY.OTHER_URL_1": this.panoramicURL.OTHER_URL_1,
          "groupParamValue_GROUP_PARAMS.SAFETY.OTHER_URL_2": this.panoramicURL.OTHER_URL_2,
          "groupParamValue_GROUP_PARAMS.SAFETY.OTHER_URL_3": this.panoramicURL.OTHER_URL_3,
          "groupParamValue_GROUP_PARAMS.SAFETY.OTHER_URL_4": this.panoramicURL.OTHER_URL_4

        }

        this.$axios({
          method: 'post',
          url: `${this.$site.videoServer}/project/project_paramtype_batch_update.do`,
          data: this.$qs.stringify(data)
        }).then(res => {
          if (res.data.status == 200) {
            this.$message.success('360全景url提交成功')
          } else {
            this.$message.error('360全景url提交失败，请重新提交')
          }
        })
      }
    }
  }
</script>
<style scoped lang="scss">

  .tableClass {
    table {
      tr {
        th {
          width: 250px;
        }
      }
    }
  }


</style>
